<template>
	<view class="content b-t">
		<s-pull-scroll ref="pullScroll" :pullDown="pullDown" :pullUp="loadData" :back-top="true" :footerHeight="65">
			<view
				class="list row between"
				style="align-items: center;"
				v-for="(item, index) in dataList"
				:key="index"
				
			>
				<view style="width:80%;" @click.stop="checkAddress(item)">
					<view class="wrapper">
						<view class="row">
							<view class="name">{{item.name}}</view>
							<view class="mobile">{{item.phone}}</view>
						</view>
						<view class="row" style="align-items: flex-start;padding-top: 20upx;">
							<view class="default" v-if="item.isDefault==1">默认</view>
							<view class="address fill">
								{{item.province}}{{item.city}}{{item.county}}{{item.detail}}
							</view>
						</view>
					</view>
				</view>
				<view style="width: 20%;" class="row">
					<view class="fill row center">
						<u-icon name="/static/img/bianji.png" size="40" @tap="userChange(item)"></u-icon>
					</view>
					<view class="fill row center">
						<u-icon name="/static/img/shanchu1.png" size="40" @click="userDelTips(item, index)"></u-icon>
					</view>
				</view>
			</view>
		</s-pull-scroll>
		<view class="footer-btn">
			<view class="add-btn" @tap.stop="navTo(`/pages/address/newAddAdress`)" hover-class="btn-hover">新增地址</view>
		</view>
		<mix-modal ref="mixModal" text="确定删除这个地址吗?" title="温馨提示" @onConfirm="delAddress"></mix-modal>
	</view>
</template>

<script>
export default {
	data() {
		return {
			source: 0,
			currentIndex:0,
			currentItem:{},
			dataList: []
		};
	},
	onLoad(options) {
		this.source = options.source;
		this.refresh();
		uni.$on("addressUpdate",()=>{
			this.refresh();
		})
	},
	methods: {
		pullDown(pullScroll) {
			setTimeout(() => {
				this.loadData(pullScroll);
			}, 200);
		},
		async loadData(pullScroll) {
			const data = {
				uid: uni.getStorageSync("uid")
			};
			const res = await this.$request("address/list", data, {showLoading: true});
			if (res.result ==1 ||res.dataList.length == 0) {
				pullScroll.empty();
				return;
			}
			this.dataList =res.dataList;
			pullScroll.finish();
		},
		userChange(item){
			getApp().globalData.addressItem=item;
			this.navTo(`/pages/address/newAddAdress?type=1`);
		},
		userDelTips(item, index) {
			this.currentItem=item;
			this.currentIndex=index;
			this.$refs.mixModal.open();
		},
		//选择地址
		checkAddress(item) {
			if (this.source == 1) {
				this.$util.prePage().setAddress(item);
				this.back();
			}
		},
		perData(id) {
			if (this.source == 1) {
				if (id == this.$util.prePage().address.id) {
					this.$util.prePage().setAddress();
				}
			}
		},
		async delAddress() {
			let data = {
				id: this.currentItem.id,
				uid:uni.getStorageSync('uid')
			};
			const res = await this.$request("address/del", data, {showLoading: true});
			if (res.result == 0) {
				this.$util.msg("删除成功!");
				this.perData(this.currentItem.id);
				this.dataList.splice(this.currentIndex,1);
				if(this.dataList.length==0){
					this.$refs.pullScroll.empty();
				}
			}else{
				this.$util.msg(res.resultNote);
			}
		}
	}
};
</script>
<style>
	page{
		background: #F6F6F6;
	}
</style>

<style lang="scss" scoped>
.tit {
	font-size: 21upx;
	color: #666666;
}

.list {
	margin-bottom: 10upx;
	padding: 20upx;
	background: #fff;
}
.default {
	padding: 4upx 8upx;
	// height: 36upx;
	text-align: center;
	// line-height: 36upx;
	background: #bec3cf;
	border-radius: 6upx;
	font-size: 20upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #f6f6f6;
	margin-right: 20upx;
}
.address {
	font-size: 24upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #666666;
	line-height: 43upx;
}
.name {
	font-size: 26upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #333333;
}

.mobile {
	font-size: 24upx;
	font-family: DIN;
	font-weight: 500;
	color: #999999;
	margin-left: 30upx;
}
.footer-btn {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 99;
	width: 100%;
	background-color: #ffffff;
	padding-bottom: var(--status-bar-height);
}
.add-btn {
	width: 700upx;
	line-height: 79upx;
	text-align: center;
	background: #cc1313;
	color: #ffffff;
	font-size: 30upx;
	border-radius: 39upx;
	margin: 0 auto;
}
</style>
